<template lang='pug'>
.tv-box 
  .wrap(v-for="d,i in tvList" :key="d.tid")
    p.wrap-one-p
      img(:src="d.title") 
    .boxwrap
      Fir(v-for="item in tvList[i].toplist" :key="item.id" :width="'48%'" flg="0" :data="item")
    .contentList
      Fir(v-for="item in tvList[i].arrList" :key="item.id" :width="'32%'" flg="1" :data="item")
</template>
 
<script>
import Fir from '../../components/Fir.vue'
export default {
  name: "vueName",
  data() {
    return {
      tvList: [],
    };
  },
  components:{
    Fir
  },
  methods: {
    getTvList() {
      this.$http.get("/ajaxdata/Tvstart/list.json").then(({ data }) => {
        this.tvList = data;
      });
    },
  },
  mounted() {
    this.getTvList();
  },
};
</script>
 
<style scoped lang="sass">
.tv-box
  width: 100%
  .wrap
    .wrap-one-p
      width: 100%
      img
        width: 100% 
        display: block
    .boxwrap
      display: flex
      justify-content: space-around
      padding-bottom: .1rem
      background: rgb(255, 174, 153)
      margin-top: -.01rem

    .contentList
      width: 100%
      display: flex
      flex-wrap: wrap
      justify-content: space-around
      background: rgb(255, 174, 153)
      margin-top: -.01rem

</style>